<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>运单录入</title>
	<!-- 导入jquery核心类库 -->
	<script type="text/javascript" src="../../js/jquery-1.8.3.js"></script>
	<!-- 导入easyui类库 -->
	<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="../../js/easyui/ext/portal.css">
	<link rel="stylesheet" type="text/css" href="../../css/default.css">
	<link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css">
	<script type="text/javascript" src="../../js/easyui/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="../../js/easyui/ext/jquery.portal.js"></script>
	<script type="text/javascript" src="../../js/easyui/ext/jquery.cookie.js"></script>
	<script src="../../js/easyui/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>

	<!-- 导入百度地图 -->
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=4IU3oIAMpZhfWZsMu7xzqBBAf6vMHcoa"></script>

	<script type="text/javascript">

		loadMapAutocomplete("sendAddress","searchResultPanelSend");
        loadMapAutocomplete("recAddress","searchResultPanelRec");
        // 百度地图API功能
        function G(id) {
            return document.getElementById(id);
        }
        <!-- 将代码抽取,为了多个输入框进行使用,放置重复 -->
        function loadMapAutocomplete(suggestId, searchResultPanel) {
            var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
                {"input": suggestId});

            ac.addEventListener("onhighlight", function (e) {  //鼠标放在下拉列表上的事件
                var str = "";
                var _value = e.fromitem.value;
                var value = "";
                if (e.fromitem.index > -1) {
                    value = _value.province + _value.city + _value.district + _value.street + _value.business;
                }
                str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

                value = "";
                if (e.toitem.index > -1) {
                    _value = e.toitem.value;
                    value = _value.province + _value.city + _value.district + _value.street + _value.business;
                }
                str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
                G(searchResultPanel).innerHTML = str;
            });

            var myValue;
            ac.addEventListener("onconfirm", function (e) {    //鼠标点击下拉列表后的事件
                var _value = e.item.value;
                myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
                G(searchResultPanel).innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
            });
        }
        <!-- ========== 百度地图js代码结束 ========= -->

        $(function() {
            // 先将body隐藏，再显示，不会出现页面刷新效果
            $("body").css({visibility:"visible"});

            /* 对save按钮条件 点击事件
            $('#save').click(function() {
                // 对form 进行校验
                if($('#orderForm').form('validate')) {
                    $('#orderForm').submit();
                }
            });
            */

            // 对save按钮条件 点击事件
            $('#save').click(function() {
                // 对form 进行校验，数据太多，暂时先不校验
                $.post("../../waybill_save.action",$("#waybillForm").serialize(),function(data){
                    // data数据格式 {success:true, msg:'xxxx'}
                    if(data.success){
                        // 保存成功
                        $.messager.show({
                            title:'提示窗口',
                            msg: data.msg,
                        });

                        // 重置表单
                        $("#waybillForm").get(0).reset();
                        $("input[name='order.id']").val('');
                    } else {
                        alert("保存失败！！！");
                    }
                });
            });

            // 对订单号输入项 添加 blur事件
            $("#orderNum").blur(function(){
                // 发起Ajax请求，查询订单数据
                $.post("../../order_findByOrderNum.action",{orderNum: $(this).val()},
                    function(data){
                        // 封装结果数据  { success:true , orderData: {} }
                        if(data.success){
                            // 装载数据
                            $("#waybillForm").form('load',data.orderData) ;
                            // 处理无法自动load 元素
                            $("input[name='order.id']").val(data.orderData.id);
                            $("input[name='order.orderNum']").val(data.orderData.orderNum);
                            $("input[name='order.courier.company']").val(data.orderData.courier.company);
                            $("input[name='order.courier.name']").val(data.orderData.courier.name);
                        }else{
                            // 订单号 不存在，重置表单
                            $("#waybillForm").get(0).reset();
                        }
                    });
            });

            // 对运单快速录入数据进行回显
            $("#wayBillNum").blur(function(){
                // 发起Ajax请求
                $.post("../../waybill_findByWayBillNum.action",{wayBillNum: $(this).val()},
                    function(data){
                        // 封装结果数据  { success:true , wayBillData: {} }
                        if(data.success){
                            // 装载数据
                            $("#waybillForm").form('load',data.wayBillData) ;
                        }
                    });
            });

        });
	</script>
</head>

<body>
<div class="datagrid-toolbar">
	<a id="add" icon="icon-add" href="#" class="easyui-linkbutton" plain="true">新增</a>
	<a id="save" icon="icon-save" href="#" class="easyui-linkbutton" plain="true">保存</a>
	<a id="no" icon="icon-no" href="#" class="easyui-linkbutton" plain="true">取消</a>
</div>

<div style="width:95%;margin:10px auto">
	<form id="waybillForm" method="post" action="../../waybill_save.action" >
		<!-- 单号信息 -->
		<div class="table-top">
			<table class="table-edit" width="95%">
				<tr class="title">
					<td colspan="6">单号信息</td>
				</tr>
				<tr>
					<td>订单号</td>
					<td>
						<input type="hidden" name="order.id" id="orderId" />
						<input type="text" name="order.orderNum" id="orderNum"/>
					</td>
					<td>运单号</td>
					<td>
						<input type="text" name="wayBillNum" id="wayBillNum"/>
					</td>
				</tr>
				<tr>
					<td>到达地</td>
					<td><input type="text" name="arriveCity" required="true" /></td>
					<td>产品时限</td>
					<td>
						<select class="easyui-combobox" name="sendProNum">
							<option value="速运当日">速运当日</option>
							<option value="速运次日">速运次日</option>
							<option value="速运隔日">速运隔日</option>
						</select>
					</td>
					<td>配载要求</td>
					<td>
						<select class="easyui-combobox" name="floadreqr">
							<option value="无">无</option>
							<option value="禁航空">禁航空</option>
							<option value="禁铁路航空">禁铁路航空</option>
						</select>
					</td>
				</tr>
				<tr>
					<td>受理单位</td>
					<td><input type="text" name="order.courier.company" required="true" /></td>
					<td>快递员</td>
					<td><input type="text" name="order.courier.name" required="true" /></td>
				</tr>
			</table>
		</div>

		<div class="table-center" style="margin-top:15px">
			<!-- 中间三大行：货物信息、收件人信息、寄件人信息 -->
			<div class="col-md-5">
				<!-- 寄件人信息 -->
				<table class="table-edit send" width="95%">
					<tr class="title">
						<td colspan="4">寄件人信息</td>
					</tr>
					<tr>
						<td>寄件人</td>
						<td><input type="text" name="sendName" required="true" /></td>
						<td>地址</td>
						<td>
							<input type="text" id="sendAddress" name="sendAddress" required="true" />
							<div id="searchResultPanelSend" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
						</td>
					</tr>
					<tr>
						<td>公司</td>
						<td><input type="text" name="sendCompany" required="true" /></td>
						<td>电话</td>
						<td><input type="text" name="sendMobile" required="true" /></td>
					</tr>
				</table>


				<!-- 收件人信息 -->
				<table class="table-edit receiver" width="95%">
					<tr class="title">
						<td colspan="4">收件人信息</td>
					</tr>
					<tr>
						<td>收件人</td>
						<td><input type="text" name="recName" required="true" /></td>
						<td>地址</td>
						<td>
							<input type="text" id="recAddress" name="recAddress" required="true" />
							<div id="searchResultPanelRec" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
						</td>
					</tr>
					<tr>
						<td>公司</td>
						<td><input type="text" name="recCompany" required="true" /></td>
						<td>电话</td>
						<td><input type="text" name="recMobile" required="true" /></td>
					</tr>
				</table>

				<!-- 货物信息 -->
				<table class="table-edit number" width="95%">
					<tr class="title">
						<td colspan="4">货物信息</td>
					</tr>
					<tr>
						<td>原件数</td>
						<td><input type="text" name="num" required="true" /></td>
						<td>实际重量</td>
						<td><input type="text" name="actlweit" required="true" /></td>
					</tr>

					<tr>
						<td>货物</td>
						<td><input type="text" name="goodsType" required="true" /></td>
						<td>体积</td>
						<td><input type="text" name="vol" required="true" /></td>
					</tr>
				</table>
			</div>


			<!-- ================== 以下信息暂时没有处理  start ================== -->
			<div class="col-md-7">
				<table class="table-edit security" width="95%">
					<tr class="title">
						<td colspan="6">包装信息</td>
					</tr>
					<tr>
						<td>保险类型</td>
						<td>
							<select class="easyui-combobox">
								<option value="0">不保险</option>
								<option value="1">委托投保</option>
								<option value="2">自带投保</option>
								<option value="3">保价</option>
							</select>
						</td>
						<td>保险费</td>
						<td><input type="text" name="secuityprice" required="true" /></td>
						<td>声明价值</td>
						<td><input type="text" name="value" required="true" /></td>
					</tr>
					<tr>
						<td>原包装</td>
						<td>
							<select class="easyui-combobox">
								<option value="0">木箱</option>
								<option value="1">纸箱</option>
								<option value="2">快递袋</option>
								<option value="3">其他</option>
							</select>
						</td>
						<td>实际包装</td>
						<td>
							<select class="easyui-combobox">
								<option value="0">木箱</option>
								<option value="1">纸箱</option>
								<option value="2">快递袋</option>
								<option value="3">其他</option>
							</select>
						</td>
					</tr>
					<tr>
						<td>包装费</td>
						<td><input type="text" name="packageprice" required="true" /></td>
						<td>包装要求</td>
						<td><input type="text" name="packageprice" required="true" /></td>
					</tr>
				</table>

				<table class="table-edit max" width="95%">
					<tr>
						<td>实际件数</td>
						<td><input type="text" name="realNum" required="true" /></td>
						<td>计费重量</td>
						<td><input type="text" name="priceWeight" required="true" /></td>
					</tr>
					<tr>
						<td>预收费</td>
						<td><input type="text" name="planprice" required="true" /></td>
						<td><button class="btn btn-default">计算</button></td>
					</tr>
				</table>

				<table class="table-edit money" width="95%">
					<tr class="title">
						<td colspan="6">计费信息</td>
					</tr>
					<tr>
						<td>结算方式</td>
						<td>
							<select class="easyui-combobox">
								<option value="0">现结</option>
								<option value="1">代付</option>
								<option value="2">网络</option>
							</select>
						</td>
						<td>代收款</td>
						<td><input type="text" name="priceWeight" required="true" /></td>
						<td>到付款</td>
						<td><input type="text" name="priceWeight" required="true" /></td>
					</tr>
				</table>

				<table class="table-edit feedback" width="95%">
					<tr class="title">
						<td colspan="4">配送信息</td>
					</tr>
					<tr>
						<td><input type="checkbox">反馈签收</td>
						<td><input type="checkbox">节假日可收货</td>
						<td>送达时限</td>
						<td><input type="text" class="easyui-datebox" data-options="editable:false" /></td>
					</tr>
					<tr>
						<td>处理方式</td>
						<td>
							<select class="easyui-combobox">
								<option value="0">无</option>
								<option value="1">不可开箱验货</option>
								<option value="2">开开箱单不可开内包</option>
								<option value="3">可开箱和内包</option>
							</select>
						</td>
						<td>签单返回</td>
						<td>
							<select class="easyui-combobox">
								<option value="0">箱单</option>
								<option value="1">原单</option>
								<option value="2">附原单</option>
								<option value="3">网络派送单</option>
							</select>
						</td>
					</tr>
				</table>

				<table class="table-edit tips" width="95%">
					<tr>
						<td>重要提示</td>
						<td><textarea style="width:250px;height: 80px;"></textarea></td>
					</tr>
				</table>
			</div>
			<!-- ================== 以上信息暂时没有处理  end ================== -->


		</div>
		<div class="clearfix"></div>
	</form>
</div>
</body>
</html>